<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">

    <h:head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>Aso Escuelas</title>
        <h:outputStylesheet library="css" name="estilo.css"/>
        <h:outputScript library="js" name="common.js" />        
    </h:head>
    <h:body>
        <p:layout fullPage="true">

            <p:layoutUnit position="north" size="100" resizable="true" closable="true" collapsible="true">
                <ui:insert name="header">
                    <ui:include src="headerUser.xhtml" />
                </ui:insert>
            </p:layoutUnit>

            <p:layoutUnit position="west" size="175" collapsible="true">
                <ui:insert name="menu">
                    <ui:include src="menuUser.xhtml" />
                </ui:insert>
            </p:layoutUnit>

            <p:layoutUnit position="center">
                <h:panelGrid columns="2" style="width: 100%" > 
                    <f:facet name="header">
                        <p:commandButton id="cmdNuev" value="Nuevo" title="Nuevo" action="#{Action.CrearMaterial()}" icon="ui-icon-close" style="margin: 0px !important" />
                        <p:commandButton id="cmdActuali" value="Actualizar" title="Actualizar" action="#{Action.ListaMaterial()}" icon="ui-icon-close" style="margin: 0px !important" />
                    </f:facet>    
                </h:panelGrid>
                
                <h:form id="frmFormulario3" enctype="multipart/form-data">

                    <p:dataGrid id="lspublicida" 
                                var="_material" 
                                value="#{GestorMaterial.listMaterial}" 
                                columns="1" style="width: 20%"  
                                rows="12" paginator="true"  
                                paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"  
                                rowsPerPageTemplate="9,12,15">  

                        <p:panel header="#{_material.nombre}" style="text-align:center; vertical-align: top;">  
                            <h:panelGrid columns="2" style=" text-align: justify" cellspacing="10%">  

                               <p:graphicImage value="/resources/imagenesSubidas/material/#{_material.imagen}" alt="imagen" height="100px"/>   

                                <h:panelGrid columns="2" style=" text-align: justify" cellspacing="10%">

                                    <h:outputText value="Fecha P." escape="false" style="font-weight: bold"/>
                                    <h:outputText value="#{_material.fechaPublicacion}" escape="false" />

                                    <h:outputText value="Categoría" escape="false" style="font-weight: bold"/>
                                    <h:outputText value="#{_material.categoria.nombre}" escape="false" />

                                    <h:outputText value="Link" escape="false" style="font-weight: bold"/>
                                    <h:outputText value="#{_material.link}" escape="false" />
                                </h:panelGrid>

                                <h:outputText value=""/>
                                <h:outputText value="Descripción" escape="false" style="font-weight: bold"/>
                                <h:outputText value=""/>
                                <h:outputText value="#{_material.descripcion}" escape="false" />

                                <h:outputText value="" />
                                <h:panelGrid columns="3">
                                    <p:commandButton id="cmdModificar" value="Editar" title="Editar" action="#{GestorMaterial.editar(_material)}" icon="ui-icon-close" style="margin: 0px !important" />
                                    <p:commandButton id="cmdEliminar" value="Eliminar" title="Eliminar" action="#{GestorMaterial.eliminar(_material)}" icon="ui-icon-close" style="margin: 0px !important">
                                        <p:confirm header="Eliminar Publicidad" message="Esta seguro?" icon="ui-icon-alert" />
                                    </p:commandButton>

                                    <p:confirmDialog global="true" showEffect="fade" hideEffect="explode">  
                                        <p:commandButton value="Si" type="button" styleClass="ui-confirmdialog-yes" icon="ui-icon-check"/>  
                                        <p:commandButton value="No" type="button" styleClass="ui-confirmdialog-no" icon="ui-icon-close"/>       
                                    </p:confirmDialog> 
                                </h:panelGrid>                                   
                            </h:panelGrid> 
                            
                        </p:panel>                          
                      </p:dataGrid>
                    
                </h:form>
            </p:layoutUnit>
        </p:layout>
    </h:body>
</html>
